<template>
    <div class="common-cover">
        <comHeader />
        <div class="common-scroll better-scroll p-t-10 pr  about-me">
            <el-button type="primary" class="p-a l-0 t-0" @click="openDialog" v-if="isAdmin"> 编辑 </el-button>

            <div class="blog-html-page-pc b-n w-1100" v-html="html"></div>
        </div>

        <aboutMeEdit v-model="visible" v-if="visible" @refresh="init" />
    </div>
</template>

<script>
export default {
    components: {
        comHeader: () => import('@/components/comHeader'),
        aboutMeEdit: () => import('@/views/homepage/about_me/aboutMeEdit.vue'),
    },
    data() {
        return {
            visible: false,
            html: '',
        }
    },
    computed: {
        ...Vuex.mapGetters(['isAdmin']),
    },
    created() {
        this.init(null)
    },
    methods: {
        async init(row) {
            if(row?.html){
                this.html = row?.html
                return
            }
            const res = await this.$apis.get_about_me()
            this.html = res?.data?.data?.html
        },
        openDialog() {
            this.visible = true
        },
    },
}
</script>

<style lang="scss" scoped>
.about-me {
    margin: 0 auto;
}
.l-0{
    left: 0;
}
.b-n{
    border: none;
}
::v-deep{
    .blog-html-page-pc img{
    opacity: 1 !important;
}
}
</style>
